<template>
    <el-select v-model="model" :placeholder="placeholder" :disabled="disabled" :filterable="filterable" :clearable="clearable" @change="handleChange" :multiple="multiple" :multiple-limit="multipleLimit">
        <slot name="blank"></slot>
        <el-option v-for="(item,index) in codeData" :label="item.text" :value="item.value" :key="index" :disabled="in_array(item.value,disabledKeys)"></el-option>
    </el-select>
</template>
<script>
import {codeProvider} from '../../../assets/js/provider.js'
import Toolkit from '../../../assets/js/toolkit.js';
export default {
    name: 'dx-select',
  
    props:{
        value : {type: null },
        clearable : {type:Boolean,default:false},
        filterable : {type:Boolean,default:false},
        disabled : {type:Boolean,default:false},
        codeType : {type:String ,default:''},
        placeholder : {type:String ,default:'请选择'},
        condition : {type:Object,default:()=>{}},
        multiple : {type:Boolean,default:false},
        multipleLimit : {type:Number,default:0},
        disabledKeys : Array
    },
    computed : {
        model : {
            get(){
                if(this.multiple){//多选的时候
                    if(!this.eq_array(this.mValue,this.value)){
                        this.initData();
                    }
                }else{
                    if(!_.eq(this.mValue,this.value)){
                        this.initData();
                    }
                }
                return this.mValue ? this.mValue : this.value;
            },
            set(val){
                this.mValue = val;
                this.$emit("input", this.mValue); // key code 
            }
        }
    },
    watch : {
        codeType(val){
            this.initData();
        },
        condition(val){
            if(!this.eq_object(val , this.mCondition)){
                this.mCondition = val;
                this.initData();
            }
        }
    },
    data(){
        return {
            mValue : this.value,
            mCondition : this.condition,
            codeData : []
        }
    },
    methods : {
        handleChange(val){
            let tmp = [];
            if(this.multiple){
                
                (val || []).forEach(value => {
                    this.codeData.forEach(item=>{
                        if(item.value == value){
                            tmp.push(item);
                        }
                    });
                })

            }else{
                tmp = "";
                this.codeData.forEach(item => {
                    if(item.value == val){
                        tmp = item;
                        
                        return;
                    }
                });
               
            }
           this.$emit('change', tmp);
        },
        initData(){

            if(this.codeType){
              
                codeProvider.getList(this.codeType,this.mCondition || {}).then(resp=>{

                    this.codeData = resp;
                    
                    this.mValue = this.value;

                    if(!this.multiple){//不是多选的级联效果时，如果子元素不在下拉列表，清空
                        if(this.model && this.codeData){
                     
                            for(let i=0;i<this.codeData.length;i++){
                                if(this.codeData[i].value === this.model){   
                                    return;
                                }
                            }
                            this.model = '';
                        }
                    }else{//多选时
                        if(this.model && this.codeData){
                     
                            let selValue = [];
                            this.mValue.forEach(item => {
                                for(let i=0;i < this.codeData.length;i++){
                                    if(this.codeData[i].value === item){
                                        selValue.push(item); 
                                        return;
                                    }
                                }
                            });
                            
                            this.model = selValue;
                        }
                    }
                    
                });
            }else{
                console.error('codeType is not empty!');
            }
        }
    },
    created(){
        this.initData();
    },
    mounted(){

    },
    mixins :[Toolkit]
}
</script>
